<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>书架</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" href="../libs/mui/mui.min.css">
		<link rel="stylesheet" href="../css/main.css" />
		<link rel="stylesheet" href="../libs/iconfont/fonts/iconfont.css" />
		<link rel="stylesheet" href="../css/pullToRefresh.css" />
	</head>
	<body>
		<style> 
			/*侧滑*/
			.mui-off-canvas-right {width: 85%;background-color: #efeff4;}
			.mui-off-canvas-right .bg{background:url(../public/img/12.jpg);background-size: cover;height: 170px;width: 100%;}
			.mui-off-canvas-right .bbs-pulish-img img{height:75px;width:75px; line-height:75px;overflow: hidden;border-radius: 100px;margin-top: 20px;;}
			.mui-bar.mui-bar-nav a{color: #c0c0c0;}
			.mui-title>span{padding: 0 20px;}
			.hidden{display: none;}
			/*书城*/
			/*轮播图*/
			.mui-slider-indicator .mui-active.mui-indicator{background:#139f13;}
			.mui-slider-indicator{right:15px;}
			.mui-slider-indicator .mui-indicator{margin:0 1px;background:#ffffff;}
			/*九宫格*/
			.mui-grid-view.mui-grid-9{background-color: #FFFFFF;border: none;}
			.mui-grid-view.mui-grid-9 .mui-table-view-cell{border: none;}
			.mui-grid-view.mui-grid-9 .mui-table-view-cell i{font-size: 35px !important;}
			/*推荐*/
			/*图片*/
			.tuijian .mui-table-view.mui-grid-view{padding: 0;}
			.tuijian .mui-table-view.mui-grid-view .mui-table-view-cell{padding-bottom: 6px; margin: 0;}
	   		.mui-table-view-cell>a:not(.mui-btn){
				 white-space:normal
			}
			.tuijian .mui-table-view .mui-table-view-cell .mui-media-object{
				line-height: 93px;
				max-width:60px;
				height: 93px;
				vertical-align: top !important;
			}
			.tuijian .mui-table-view.mui-grid-view .mui-table-view-cell .mui-media-body{width: auto;height: auto;text-align: left;}
			.tuijian .jieshao{position: absolute; bottom:10px;color:#000000;font-size: 13px;line-height:15px;text-overflow: ellipsis;overflow: hidden; word-break: break-all;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
			/*新书上架*/
			.new-book .mui-table-view .mui-table-view-cell .mui-media-object{
				line-height: 93px;
				max-width:60px;
				height: 93px;
				vertical-align: top !important;
			}
			.new-book .jieshao{margin-top:1em;color:#000000;font-size: 13px;line-height:15px;text-overflow: ellipsis;overflow: hidden; word-break: break-all;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
			.new-book .autor{margin-top: 5px;}
			/*专题*/
			.zhuanti-detail .mui-table-view .mui-table-view-cell .mui-media-object{
				line-height: 93px;
				max-width:60px;
				height: 93px;
				vertical-align: top !important;
			}
			.zhuanti-detail .jieshao{margin-top:1em;color:#000000;font-size: 13px;line-height:15px;text-overflow: ellipsis;overflow: hidden; word-break: break-all;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
			.zhuanti-detail .autor{margin-top: 5px;}
			/*书架*/
			#book1 .mui-table-view{background-color: inherit;}
			#book1 .mui-table-view:after{height: 0;}
			.list .mui-media-body{height: auto !important; text-align: left;}
			.list .mui-media-body .title{font-size: 13px;}
			.list{padding: 10px;}
			.list .mui-media-object{-webkit-box-shadow:0 5px 10px #858585;box-shadow: 0 5px 10px #858585;}
			/*最近*/
			.img{position: relative;}
			.recent{position: absolute;top: 0px;right:0px;}
			.back i{font-size: 22px;} 
		</style>
				<!--侧滑菜单容器-->
		<div id="offCanvasWrapper" class="mui-off-canvas-wrap mui-draggable">
			<!--菜单部分-->
			<aside id="offCanvasSide" class="mui-off-canvas-right">
				<div id="offCanvasSideScroll" class="mui-scroll-wrapper">
					<div class="mui-scroll">
						<div class="bg">
							<div class="bbs-pulish-img mui-text-center">
								<img src="../public/img/default.png" class="avatar"/>
								<div class="white nickname"></div>
								<p class="white m5 signature"></p>
							</div>
						</div>
						<div class="content">
							<ul class="mui-table-view">
								<li class="mui-table-view-cell buy" >
									<i class="mui-icon iconfont">&#xe60a;</i>
									<span>已购买</span>
								</li> 
								<li class="mui-table-view-cell shopping-car">
									<i class="mui-icon iconfont">&#xe60e;</i>
									<span>购物车</span>
								</li>  
								<li class="mui-table-view-cell account">
									<i class="mui-icon iconfont">&#xe60d;</i>
									<span>账户余额</span>
								</li>
							</ul>
							<ul class="mui-table-view mui-table-view-chevron m5">
								<li class="mui-table-view-cell buy-record">
									<i class="mui-icon iconfont">&#xe60c;</i>
									<span>购买记录</span>
								</li>
								<li class="mui-table-view-cell comment">
									<i class="mui-icon iconfont">&#xe609;</i>
									<span>评价</span>
								</li>
								<li class="mui-table-view-cell share-record">
									<i class="mui-icon iconfont">&#xe60b;</i>
									<span>分享</span>
								</li>
							</ul>
							<ul class="mui-table-view mui-table-view-chevron m5">
								<li class="mui-table-view-cell want-read">
									<i class="mui-icon iconfont">&#xe625;</i>
									<span>想读</span>
								</li>
								<!--<li class="mui-table-view-cell read-setting" >
									<i class="mui-icon iconfont">&#xe608;</i>
									<span>阅读设置</span>
								</li>-->
								<li class="mui-table-view-cell setting">
									<i class="mui-icon iconfont">&#xe607;</i>
									<span>系统设置</span>
								</li>
							</ul>
						</div>
					</div>
				</div>
			</aside>
			<div class="mui-inner-wrap">
				<header class="mui-bar mui-bar-nav">
					<a class="search"><i class="mui-icon iconfont gray">&#xe600;</i></a>
					<a class="mui-title">
						<span class="mui-lvs">书城</span>
						<span>书架</span>
					</a>
					<a class="mui-pull-right" id="offCanvasBtn" href="#offCanvasSide"><i class="mui-icon iconfont gray">&#xe601;</i></a>
				</header>
				<div id="offCanvasContentScroll" class="mui-content mui-scroll-wrapper">
					<div class="mui-scroll">
					<div class="detail" id="book0">
						<div id="slider" class="mui-slider">
							<div class="mui-slider-group mui-slider-loop">
								<!-- 额外增加的一个节点(循环轮播：第一个节点是最后一张轮播) -->
								<div class="mui-slider-item mui-slider-item-duplicate">
									<a>
										<img src="../public/img/11.jpg">
									</a>
								</div>
								<div class="mui-slider-item carousel">
									<a>
										<img src="../public/img/11.jpg">
									</a>
								</div>
								<div class="mui-slider-item carousel">
									<a>
										<img src="../public/img/11.jpg">
									</a>
								</div>
								<div class="mui-slider-item carousel">
									<a>
										<img src="../public/img/11.jpg">
									</a>
								</div>
								<!-- 额外增加的一个节点(循环轮播：最后一个节点是第一张轮播) -->
								<div class="mui-slider-item mui-slider-item-duplicate">
									<a>
										<img src="../public/img/11.jpg">
									</a>
								</div>
							</div>
							<div class="mui-slider-indicator mui-text-right">
								<div class="mui-indicator mui-active"></div>
								<div class="mui-indicator"></div>
								<div class="mui-indicator"></div>
							</div>
						</div>
						<ul class="mui-table-view mui-grid-view mui-grid-9">
				            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
				            	<a class="classify-area">
				                    <i class="mui-icon iconfont mui-zi">&#xe602;</i>
				                    <div class="mui-media-body">分类</div>
				            	</a>
				            </li>
				            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
				            	<a class="zhekou-area">
				                    <i class="mui-icon iconfont mui-red">&#xe603;</i>
				                    <div class="mui-media-body">折扣区</div>
				            	</a>
				            </li>
				            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
				            	<a class="hot-area">
				                   	<i class="mui-icon iconfont mui-lvs">&#xe606;</i>
				                    <div class="mui-media-body">热门榜单</div>
				            	</a>
				            </li>
				        </ul> 
				        <div class="m5 tuijian">
				        	<ul class="mui-table-view">
				        		<li class="mui-table-view-cell">
				        			<div style="border-left: 4px solid #139f13; position: absolute; height: 26px; left: 0; top:50%; margin-top: -13px;"></div>
				        			推荐书籍
				        			<span class="mui-pull-right mui-lvs more classifies">更多</span>
				        		</li>
				        	</ul>
				        	<ul class="mui-table-view mui-grid-view tuijian-list">
								<li class="mui-table-view-cell mui-media mui-col-xs-6">
									<a>
										<img class="mui-media-object mui-pull-left" src="../public/img/book.jpg">
										<div class="mui-media-body">
											<span class="mui-h5 back"><span class="book_name"></span><i class="mui-icon iconfont mui-red">&#xe6e3;</i></span>
											<p class="mui-h6 jieshao mui-ellipsis-1"></p>
										</div>
									</a> 
								</li>
								<li class="mui-table-view-cell mui-media mui-col-xs-6" style="border-left: 1px solid #ccc;">
									<a>
										<img class="mui-media-object mui-pull-left" src="../public/img/book.jpg">
										<div class="mui-media-body">
											<span class="mui-h5 back"><span class="book_name"></span><i class="mui-icon iconfont mui-red">&#xe6e3;</i></span>
											<p class="mui-h6 jieshao mui-ellipsis-1"></p>
										</div>
									</a>
								</li>
							</ul>
				        </div>
				        <div class="m5 new-book">
				        	<ul class="mui-table-view">
				        		<li class="mui-table-view-cell">
				        			<div style="border-left: 4px solid #139f13; position: absolute; height: 26px; left: 0; top:50%; margin-top: -13px;"></div>
				        			新书上架
				        			<span class="mui-pull-right mui-lvs more classifies">更多</span>
				        		</li>
				        	</ul>
				        	<ul class="mui-table-view new-book-list">
								<li class="mui-table-view-cell mui-media">
									<a href="javascript:;">
										<img class="mui-media-object mui-pull-left" src="../public/img/book.jpg">
										<div class="mui-media-body">
											<span class="mui-h5 back"><span class="book_name"></span><i class="mui-icon iconfont mui-red">&#xe6e4;</i></span>
											<p class="mui-h6 jieshao description"></p>
											<p class="autor">
												<span class="mui-h6 back author"></span>
												<span class="mui-pull-right" >
													<i class="iconfont" style="vertical-align: middle;">&#xe605;</i>
													<span class="num hits">0</span>
												</span>
											</p>
										</div>
									</a>
								</li>
							</ul>
							<ul class="mui-table-view new-book-list">
								<li class="mui-table-view-cell mui-media">
									<a href="javascript:;">
										<img class="mui-media-object mui-pull-left" src="../public/img/book.jpg">
										<div class="mui-media-body">
											<span class="mui-h5 back"><span class="book_name"></span><i class="mui-icon iconfont mui-red">&#xe6e4;</i></span>
											<p class="mui-h6 jieshao description"></p>
											<p class="autor">
												<span class="mui-h6 back author"></span>
												<span class="mui-pull-right" >
													<i class="iconfont" style="vertical-align: middle;">&#xe605;</i>
													<span class="num hits">0</span>
												</span>
											</p>
										</div>
									</a>
								</li>
							</ul>
				        </div>
				        <div class="m5 zhuanti">
				        	<ul class="mui-table-view">
				        		<li class="mui-table-view-cell mui-text-center">
				        			专题书籍
				        		</li>
				        	</ul>
				        	<div class="m5 zhuanti-detail">
					        	<ul class="mui-table-view">
					        		<li class="mui-table-view-cell">
					        			<div style="border-left: 4px solid #139f13; position: absolute; height: 26px; left: 0; top:50%; margin-top: -13px;"></div>
					        			<span class="special">专题1</span>
					        		</li>
					        	</ul>
					        	<ul class="mui-table-view special_1">
									<li class="mui-table-view-cell mui-media">
										<a href="javascript:;">
											<img class="mui-media-object mui-pull-left" src="../public/img/book.jpg">
											<div class="mui-media-body">
												<span class="mui-h5 back book_name"></span>
												<p class="mui-h6 jieshao description"></p>
												<p class="autor">
													<span class="mui-h6 back author"></span>
													<span class="mui-pull-right" >
														<i class="iconfont" style="vertical-align: middle;">&#xe605;</i>
														<span class="num hits">0</span>
													</span>
												</p>
											</div>
										</a>
									</li>
								</ul>
								<ul class="mui-table-view special_1">
									<li class="mui-table-view-cell mui-media">
										<a href="javascript:;">
											<img class="mui-media-object mui-pull-left" src="../public/img/book.jpg">
											<div class="mui-media-body">
												<span class="mui-h5 back book_name"></span>
												<p class="mui-h6 jieshao description"></p>
												<p class="autor">
													<span class="mui-h6 back author"></span>
													<span class="mui-pull-right" >
														<i class="iconfont" style="vertical-align: middle;">&#xe605;</i>
														<span class="num hits">0</span>
													</span>
												</p>
											</div>
										</a>
									</li>
								</ul>
								<ul class="mui-table-view special_1">
									<li class="mui-table-view-cell mui-media">
										<a href="javascript:;">
											<img class="mui-media-object mui-pull-left" src="../public/img/book.jpg">
											<div class="mui-media-body">
												<span class="mui-h5 back book_name"></span>
												<p class="mui-h6 jieshao description"></p>
												<p class="autor">
													<span class="mui-h6 back author"></span>
													<span class="mui-pull-right" >
														<i class="iconfont" style="vertical-align: middle;">&#xe605;</i>
														<span class="num hits">0</span>
													</span>
												</p>
											</div>
										</a>
									</li>
								</ul>
					        </div>
					        <div class="m5 zhuanti-detail">
					        	<ul class="mui-table-view">
					        		<li class="mui-table-view-cell">
					        			<div style="border-left: 4px solid #139f13; position: absolute; height: 26px; left: 0; top:50%; margin-top: -13px;"></div>
					        			<span class="special">专题2</span>
					        		</li>
					        	</ul>
					        	<ul class="mui-table-view special_2">
									<li class="mui-table-view-cell mui-media">
										<a href="javascript:;">
											<img class="mui-media-object mui-pull-left" src="../public/img/book.jpg">
											<div class="mui-media-body">
												<span class="mui-h5 back book_name"></span>
												<p class="mui-h6 jieshao description"></p>
												<p class="autor">
													<span class="mui-h6 back author"></span>
													<span class="mui-pull-right" >
														<i class="iconfont" style="vertical-align: middle;">&#xe605;</i>
														<span class="num hits">0</span>
													</span>
												</p>
											</div>
										</a>
									</li>
								</ul>
								<ul class="mui-table-view special_2">
									<li class="mui-table-view-cell mui-media">
										<a href="javascript:;">
											<img class="mui-media-object mui-pull-left" src="../public/img/book.jpg">
											<div class="mui-media-body">
												<span class="mui-h5 back book_name"></span>
												<p class="mui-h6 jieshao description"></p>
												<p class="autor">
													<span class="mui-h6 back author"></span>
													<span class="mui-pull-right" >
														<i class="iconfont" style="vertical-align: middle;">&#xe605;</i>
														<span class="num hits">0</span>
													</span>
												</p>
											</div>
										</a>
									</li>
								</ul>
								<ul class="mui-table-view special_2">
									<li class="mui-table-view-cell mui-media">
										<a href="javascript:;">
											<img class="mui-media-object mui-pull-left" src="../public/img/book.jpg">
											<div class="mui-media-body">
												<span class="mui-h5 back book_name"></span>
												<p class="mui-h6 jieshao description"></p>
												<p class="autor">
													<span class="mui-h6 back author"></span>
													<span class="mui-pull-right" >
														<i class="iconfont" style="vertical-align: middle;">&#xe605;</i>
														<span class="num hits">0</span>
													</span>
												</p>
											</div>
										</a>
									</li>
								</ul>
					        </div>
					        <div class="m5 zhuanti-detail">
					        	<ul class="mui-table-view">
					        		<li class="mui-table-view-cell">
					        			<div style="border-left: 4px solid #139f13; position: absolute; height: 26px; left: 0; top:50%; margin-top: -13px;"></div>
					        			<span class="special">专题3</span>
					        		</li>
					        	</ul>
					        	<ul class="mui-table-view special_3">
									<li class="mui-table-view-cell mui-media">
										<a href="javascript:;">
											<img class="mui-media-object mui-pull-left" src="../public/img/book.jpg">
											<div class="mui-media-body">
												<span class="mui-h5 back book_name"></span>
												<p class="mui-h6 jieshao description"></p>
												<p class="autor">
													<span class="mui-h6 back author"></span>
													<span class="mui-pull-right" >
														<i class="iconfont" style="vertical-align: middle;">&#xe605;</i>
														<span class="num hits">0</span>
													</span>
												</p>
											</div>
										</a>
									</li>
								</ul>
								<ul class="mui-table-view special_3">
									<li class="mui-table-view-cell mui-media">
										<a href="javascript:;">
											<img class="mui-media-object mui-pull-left" src="../public/img/book.jpg">
											<div class="mui-media-body">
												<span class="mui-h5 back book_name"></span>
												<p class="mui-h6 jieshao description"></p>
												<p class="autor">
													<span class="mui-h6 back author"></span>
													<span class="mui-pull-right" >
														<i class="iconfont" style="vertical-align: middle;">&#xe605;</i>
														<span class="num hits">0</span>
													</span>
												</p>
											</div>
										</a>
									</li>
								</ul>
								<ul class="mui-table-view special_3">
									<li class="mui-table-view-cell mui-media">
										<a href="javascript:;">
											<img class="mui-media-object mui-pull-left" src="../public/img/book.jpg">
											<div class="mui-media-body">
												<span class="mui-h5 back book_name"></span>
												<p class="mui-h6 jieshao description"></p>
												<p class="autor">
													<span class="mui-h6 back author"></span>
													<span class="mui-pull-right" >
														<i class="iconfont" style="vertical-align: middle;">&#xe605;</i>
														<span class="num hits">0</span>
													</span>
												</p>
											</div>
										</a>
									</li>
								</ul>
					        </div>
				        </div>
				        
				        
					</div>
					<div class="detail hidden bookself" id="book1">  
						<ul class="mui-table-view mui-grid-view book_lists">
				            <!--<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
				            	<div class="list list1">
				            		<div class="img">
				             			<img class="mui-media-object" src="../public/img/6.jpg" />
			             				<div class="recent"><img src="../public/img/7.png"></div>
				             		</div>
									<div class="mui-media-body">
										<div class="title">
											从你的全世界走过
										</div>
									</div>
				            	</div>
				            </li>
				            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
				             	<div class="list list1">
				             		<div class="img">
				             			<img class="mui-media-object" src="../public/img/6.jpg" />
			             				<div class="recent"><img src="../public/img/7.png"></div>
				             		</div>
									<div class="mui-media-body">
										<div class="title">
											从你的全世界走过
										</div>
									</div>
				            	</div>
				            </li>
				            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
				             	<div class="list list1">
				            		<div class="img">
				             			<img class="mui-media-object" src="../public/img/6.jpg" />
			             				<div class="recent"><img src="../public/img/7.png"></div>
				             		</div>
									<div class="mui-media-body">
										<div class="title">
											从你的全世界走过
										</div>
									</div>
				            	</div>
				            </li>
				            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
				             	<div class="list list1">
				            		<div class="img">
				             			<img class="mui-media-object" src="../public/img/6.jpg" />
			             				<div class="recent"><img src="../public/img/7.png"></div>
				             		</div>
									<div class="mui-media-body">
										<div class="title">
											从你的全世界走过
										</div>
									</div>
				            	</div>
				            </li>
				            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
				             	<div class="list list1">
				            		<div class="img">
				             			<img class="mui-media-object" src="../public/img/6.jpg" />
			             				<div class="recent"><img src="../public/img/7.png"></div>
				             		</div>
									<div class="mui-media-body">
										<div class="title">
											从你的全世界走过
										</div>
									</div>
				            	</div>
				            </li>
				          	<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
				             	<div class="list list1">
				            		<div class="img">
				             			<img class="mui-media-object" src="../public/img/6.jpg" />
			             				<div class="recent"><img src="../public/img/7.png"></div>
				             		</div>
									<div class="mui-media-body">
										<div class="title">
											从你的全世界走过
										</div>
									</div>
				            	</div>
				            </li>
				            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
				            	<div class="list list2">
				            		<div class="img">
				             			<img class="mui-media-object" src="../public/img/6.jpg" />
				             		</div>
									<div class="mui-media-body">
										<div class="title">
											从你的全世界走过
										</div>
									</div>
				            	</div>
				            </li>
				            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
				            	<div class="list list2">
				            		<div class="img">
				             			<img class="mui-media-object" src="../public/img/6.jpg" />
				             		</div>
									<div class="mui-media-body">
										<div class="title">
											从你的全世界走过
										</div>
									</div>
				            	</div>
				            </li>
				            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
				            	<div class="list list2">
				            		<div class="img">
				             			<img class="mui-media-object" src="../public/img/6.jpg" />
				             		</div>
									<div class="mui-media-body">
										<div class="title">
											从你的全世界走过
										</div>
									</div>
				            	</div>
				            </li>
				            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
				            	<div class="list list2">
				            		<div class="img">
				             			<img class="mui-media-object" src="../public/img/6.jpg" />
				             		</div>
									<div class="mui-media-body">
										<div class="title">
											从你的全世界走过
										</div>
									</div>
				            	</div>
				            </li>
				            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
				             	<div class="list list2">
				             		<div class="img">
				             			<img class="mui-media-object" src="../public/img/6.jpg" />
				             		</div>
									<div class="mui-media-body">
										<div class="title">
											从你的全世界走过
										</div>
									</div>
				            	</div>
				            </li>
				            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
				             	<div class="list list2">
				            		<div class="img">
				             			<img class="mui-media-object" src="../public/img/6.jpg" />
				             		</div>
									<div class="mui-media-body">
										<div class="title">
											从你的全世界走过
										</div>
									</div>
				            	</div>
				            </li>-->
				        </ul>
					</div>
					</div>
				</div>
				<!-- off-canvas backdrop -->
				<div class="mui-off-canvas-backdrop"></div> 
			</div>
		</div>
		
		
		<script src="../js/mui.js"></script>
		<script src="../js/open.js"></script>
		<script src="../libs/jquery/jquery.js"></script>
		<script type="text/javascript" src="../js/public.js" ></script>
		<script type="text/javascript" src="../js/app/book.js" ></script>
		<script type="text/javascript" src="../js/app/bookself.js" ></script>
		<script type="text/javascript" src="../js/mui.pullToRefresh.js" ></script>
		<script type="text/javascript" src="../js/details.js" ></script>
		<script>
			mui.init({
				swipeBack: false
			});
//			mui.init({
//				pullRefresh: {
//					container: '#book1',
//					up: {
//						contentrefresh: '正在加载...',
//						callback: pullupRefresh
//					}
//				}
//			}); 
//			
//			/** 
//			 * 上拉加载具体业务实现 
//			 */
//			function pullupRefresh() {
//				setTimeout(function() {
////					mui('#pullrefresh').pullRefresh().endPullupToRefresh(true); //参数为true代表没有更多数据了。
//				}, 1500);
//			}
			
			 //侧滑容器父节点
			var offCanvasWrapper = mui('#offCanvasWrapper');
			 //主界面容器
			var offCanvasInner = offCanvasWrapper[0].querySelector('.mui-inner-wrap');
			 //菜单容器
			var offCanvasSide = document.getElementById("offCanvasSide");
			 //Android暂不支持整体移动动画
			if (!mui.os.android) {
				var spans = document.querySelectorAll('.android-only');
				for (var i = 0, len = spans.length; i < len; i++) {
					spans[i].style.display = "none";
				}
			}
			 //移动效果是否为整体移动
			var moveTogether = false;
			 //侧滑容器的class列表，增加.mui-slide-in即可实现菜单移动、主界面不动的效果；
			var classList = offCanvasWrapper[0].classList;
				classList.add('mui-slide-in');
			 //主界面和侧滑菜单界面均支持区域滚动；
			mui('#offCanvasSideScroll').scroll();
			mui('#offCanvasContentScroll').scroll();
			 //实现ios平台的侧滑关闭页面；
			if (mui.os.plus && mui.os.ios) {
				offCanvasWrapper[0].addEventListener('shown', function(e) { //菜单显示完成事件
					plus.webview.currentWebview().setStyle({
						'popGesture': 'none'
					});
				});
				offCanvasWrapper[0].addEventListener('hidden', function(e) { //菜单关闭完成事件
					plus.webview.currentWebview().setStyle({
						'popGesture': 'close'
					});
				});
			}
			var slider = mui("#slider");
				$(window).on("load",function(e){
					slider.slider({
						interval: 3000
					}); 
			})
			$(".mui-title>span").each(function(i){
				var $this=$(this)
				$this.on('tap',function(){
					$(".mui-title>span").removeClass('mui-lvs')
					$this.addClass('mui-lvs')
					$(".detail").addClass('hidden');
                	$('#book'+i).removeClass('hidden')
                	
				})
			})
			//处理逻辑：1秒内，连续两次按返回键，则退出应用；
			var first = null;
			var showMenu = null;
			mui.back = function() {
				if (showMenu) {
					closeMenu();
				} else {
					//首次按键，提示‘再按一次退出应用’
					if (!first) {
						first = new Date().getTime();
						mui.toast('再按一次退出应用');
						setTimeout(function() {
							first = null;
						}, 1000);
					} else {
						if (new Date().getTime() - first < 1000) {
							plus.runtime.quit();
						}
					}
				}
			};
		</script>
		<script>
//			$(".search").on('tap',function(){
//				openNewPage("search.html");
//			})
//			$('.bbs-pulish-img img').on('tap',function(){
//				openNewPage('person-info.html')
//			})
			$(".buy").on('tap',function(){
				goUrl("buy.html" , 'buy');
			})
			$(".shopping-car").on('tap',function(){
				openNewPage("shopping-car.html");
			})
			$(".account").on('tap',function(){
				openNewPage("account.html");
			})
			$(".buy-record").on('tap',function(){
				goUrl("buy-record.html" , 'buy_record');
			})
			$(".comment").on('tap',function(){
				openNewPage("comment.html");
			})
			$(".share-record").on('tap',function(){
				openNewPage("share-record.html");
			})
			$(".want-read").on('tap',function(){
				openNewPage("want-read.html");
			})
			$(".read-setting").on('tap',function(){
				openNewPage("read-setting.html");
			})
			$(".setting").on('tap',function(){
				openNewPage("setting.html");
			})
//			$("#book0 .list").on('tap',function(){
//				openNewPage('book-detail.html');
//			})
//			$("#book1 .list1").on('tap',function(){
//				openNewPage('book-detail-needbuy.html');
//			})
//			$("#book1 .list2").on('tap',function(){
//				openNewPage('book-detail.html');
//			})
			$(".zhekou-area").on('tap',function(){
				openNewPage('discount1.html')
			})
			$(".hot-area").on('tap',function(){
				openNewPage('hot.html')
			})
			$(".classify-area").on('tap',function(){
				openNewPage('classify.html')
			})
//			$(".tuijian .more").on('tap',function(){
//				openNewPage('tuijian.html')
//			})
//			$(".new-book .more").on('tap',function(){
//				openNewPage('new-books.html')
//			})
//			$(".new-book-list").on('tap',function(){
//				openNewPage('book-detail.html')
//			})
//			$(".tuijian-list a").on('tap',function(){
//				openNewPage('book-detail-needbuy.html')
//			})
//			$(".zhuanti-detail a").on('tap',function(){
//				openNewPage('book-detail.html')
//			})
		</script>
		<script type="text/javascript">
			(function($) {
				//阻尼系数
				var deceleration = mui.os.ios?0.003:0.0009;
				$('.mui-scroll-wrapper').scroll({
					bounce: false,
					indicators: true, //是否显示滚动条
					deceleration:deceleration
				});
				var count = 1;
				$.ready(function() {
					//循环初始化所有下拉刷新，上拉加载。
					$.each(document.querySelectorAll('.bookself'), function(index, pullRefreshEl) {
						$(pullRefreshEl).pullToRefresh({
							up: {
								callback: function() {
									var self = this;
									setTimeout(function() {
										myBookself(memberInfo.aid , 1 , ++count , self);
									}, 1000);
								}
							}
						});
					});
				});
			})(mui);
		</script>
	</body>

</html>